<template>
  <el-breadcrumb separator="/">
    <el-breadcrumb-item :to="'/' ">首页</el-breadcrumb-item>
    <el-breadcrumb-item :to="item.path" v-for="(item, index) in breadcrumbList" :key="index">{{ item.name }}</el-breadcrumb-item>
  </el-breadcrumb>
</template>

<script>
export default {
  name: "BreadCrumbRow",
  data() {
    return {
      breadcrumbList: []
    }
  },
  created() {
    let self = this
    const matched = this.$route.matched
    const breadcrumbList = []
    matched.forEach(item => {
      const {meta, path} = item
      breadcrumbList.push({
        name: meta.title,
        path: item.children && item.children.length && ![item.redirect, item.path].includes(self.$route.path) ? path : undefined
      })
    })
    this.breadcrumbList = breadcrumbList
  }
}
</script>

<style lang="less" scoped>

</style>
